
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>博看文思</title>
  <!-- Link Swiper's CSS -->
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">  
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/swiper.min.css">
    <link rel="stylesheet" href="css/animate.min.css">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
<audio controls  style="display:none; height: 0"  id="mplay"  play loop="loop">
    <source src="img/1.mp3" type="audio/mpeg">
</audio>
  <!-- Swiper -->
  <div class="swiper-container swiper-container-h">
    <div class="swiper-wrapper">
      <div class="swiper-slide">
          <img src="img/1-2.png" alt=""  class="fir-two  ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="0.8s" swiper-animate-delay="0.2s" >
          <img src="img/1-1.png" alt=""  class="fir-fir  ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="0.8s" swiper-animate-delay="1s" >
          <img src="img/1-3.png" alt="" class="fir-thr ani"  swiper-animate-effect=" rotateInDownRight " swiper-animate-duration="2s" swiper-animate-delay="0.1s" >
          <div class="top_black"></div>
      </div>
      <div class="swiper-slide swiper-container-v">
          <img src="img/2-1.png" alt="" class="tow-fir  ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="0.8s" swiper-animate-delay="0s">
          <img src="img/2-2.png" alt="" class="tow-tow  ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="0.8s" swiper-animate-delay=".5s">
          <div class="sharp_box ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.8s" swiper-animate-delay=".5s">
            <div class=" sharp1 ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s" swiper-animate-delay="1s">培训</div>
            <div class=" sharp2 ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s" swiper-animate-delay="3s">IT咨询</div>
            <div class=" sharp3 ani" swiper-animate-effect=" rotateIn" swiper-animate-duration="1s" swiper-animate-delay="2s">解决方案</div>
            <div class=" sharp4 ani" swiper-animate-effect="  rotateIn " swiper-animate-duration="1s" swiper-animate-delay="4s"> 外包服务</div>
            <div class=" sharp5 ani" swiper-animate-effect="rotateIn" swiper-animate-duration="1s" swiper-animate-delay="5s">产品研发</div>
          </div>
          <div class="top_black"></div>
      </div>
      <div class="swiper-slide">
          <div class="top_black"></div>

      </div>

      <div class="swiper-slide">
          <h3  class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="0.3s" swiper-animate-delay="0.2s">产品研创高效教育模式</h3>
          <img src="img/page4i.png" alt="" class="for-fir ani" swiper-animate-effect=" rubberBand" swiper-animate-duration="0.8s" swiper-animate-delay="0.8s" >
          <div class="top_black"></div>
      </div>

      <div class="swiper-slide">
          <img src="img/page5i.png" alt="" class="five-fir ani" 
          swiper-animate-effect=" flip" swiper-animate-duration="0.5s" swiper-animate-delay="0.4s" >
          <img src=" img/1-3.png" alt="" class="five-tow ani"  swiper-animate-effect=" rotateInDownRight " swiper-animate-duration="2s" swiper-animate-delay="0.1s" >
          <p class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.7s">博看文思的客户端遍布全球,研发项目涉及电子商务 IT服
            务 P2P SNS 大数据 智能硬件,可穿戴设备,云计算等各行各业,博看文思自主研发的APP产品被对此评为'精品应用'.博看文思的项目成果不仅极大的满足了客户的需求,并且强有力地推动了移动互联网行业的发展</p>
           <div class="top_black"></div>
      </div>

      <div class="swiper-slide">
          <img src="img/page6i.png" alt="" class="five-fir ani" 
          swiper-animate-effect=" flip" swiper-animate-duration="0.5s" swiper-animate-delay="0.4s" >
          <img src=" img/1-3.png" alt="" class="five-tow ani"  swiper-animate-effect=" rotateInDownRight " swiper-animate-duration="3s" swiper-animate-delay="0.1s" >
          <p class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.7s">博看文思团队由中丶美300余为专家组成,拥有国内先进的自主知识产权的游戏物理引擎丶3D引擎和手机跨平台开发框架,与包括时间500强在内的多家企业进行项目外包丶技术解决方案等综合服务</p>
          <div class="top_black"></div>
      </div>

      <div class="swiper-slide">
          <img src="img/page7i.png" alt="" class="five-fir ani" 
          swiper-animate-effect=" flip" swiper-animate-duration="0.5s" swiper-animate-delay="0.4s" >
          <img src=" img/1-3.png" alt="" class="five-tow ani"  swiper-animate-effect=" rotateInDownRight " swiper-animate-duration="4s" swiper-animate-delay="0.1s" >
          <p class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.7s">博看文思专注于移动互联高端人才培养, 课程涵盖了ios,HTML5和Android应用领域,先后在北京丶广州丶厦门丶西安等地建立实训中心,累计为企业输送6万名高端移动开发人才</p>
          <div class="top_black"></div>
      </div>
      <div class="swiper-slide">
          <img src="img/page8i.png" alt="" class="five-fir ani" 
          swiper-animate-effect=" flip" swiper-animate-duration="0.5s" swiper-animate-delay="0.4s" >
          <img src=" img/1-3.png" alt="" class="five-tow ani"  swiper-animate-effect=" rotateInDownRight " swiper-animate-duration="4s" swiper-animate-delay="0.1s" >
          <p class="ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.3s" swiper-animate-delay="0.7s">作为国家自主创新示范区常青藤创业园所在地,博看文思用成熟的产品策划丶框架丶开发丶上线等流程,鼓励大学生自主创业,博看提供创业出去最缺乏的项目(不低于5000美金) , 博看文思与创业团队全方位合作,共同研发丶推广产品.</p>
          <div class="top_black"></div>
      </div>

      <div class="swiper-slide">
           <img src="img/1-3.png" alt="" class="five-tow ani"  swiper-animate-effect=" rotateInDownRight " swiper-animate-duration="4s" swiper-animate-delay="1s" >
          <img src="img/8-1.png" alt="" class="nin-fir ani" swiper-animate-effect="flipInY" swiper-animate-duration=".4s" swiper-animate-delay="0.5s" >
          <img src="img/81.png" alt=""  class="nin-two ani" swiper-animate-effect="flipInY " swiper-animate-duration=".4s" swiper-animate-delay="1s" >
          <img src="img/82.png" alt=""  class="nin-thr ani" swiper-animate-effect="flipInY" swiper-animate-duration=".4s" swiper-animate-delay="1.4s" >
          <img src="img/83.png" alt=""  class="nin-for ani" swiper-animate-effect="flipInY" swiper-animate-duration=".4s" swiper-animate-delay="1.8s" >
          <img src="img/84.png" alt=""  class="nin-tiv ani" swiper-animate-effect="flipInY" swiper-animate-duration=".4s" swiper-animate-delay="2.2s" >
          <img src="img/85.png" alt=""  class="nin-six ani" swiper-animate-effect="flipInY" swiper-animate-duration=".4s" swiper-animate-delay="2.6s" >
          <img src="img/86.png" alt=""  class="nin-sev ani" swiper-animate-effect="flipInY" swiper-animate-duration=".4s" swiper-animate-delay="3s" >
          <div class="top_black"></div>
      </div>

      <div class="swiper-slide">
           <img src="img/1-3.png" alt="" class="five-tow ani"  swiper-animate-effect=" rotateInDownRight" swiper-animate-duration="4s" swiper-animate-delay="1s" >
          <h2 class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="0.5s" swiper-animate-delay="0.2s" >合作企业</h2>
          <p class="ani" swiper-animate-effect="bounceInDown" swiper-animate-duration="0.8s" swiper-animate-delay="1s" >战略联盟与合作伙伴关系是博看文思业务持续发展的重要保证,博看文思已经与行业领导者建立了战略合作伙伴关系,紧密的合作伙伴关系,确保博看文思能过满足客户的各种需求,并为客户提供最优秀的解决方案</p>
          <img src="img/qyhz.png" alt="" class="ten-fir ani" swiper-animate-effect="bounceInUp" swiper-animate-duration="0.8s" swiper-animate-delay="1.5s">
           <div class="top_black"></div>
      </div>

      <div class="swiper-slide">
          <img src="img/10-1.png" alt="" class="ten1-fir ani"  swiper-animate-effect=" rotateInDownRight " swiper-animate-duration=".2s" swiper-animate-delay=".1s" >
          <img src="img/101.jpg" alt="" class="ten1-two ani" swiper-animate-effect=" bounceInLeft" swiper-animate-duration=".5s" swiper-animate-delay=".5s" >
          <img src="img/102.jpg" alt="" class="ten1-thr ani" swiper-animate-effect=" bounceInRight" swiper-animate-duration=".5s" swiper-animate-delay="1s" >
          <img src="img/103.jpg" alt="" class="ten1-for ani" swiper-animate-effect=" bounceInLeft" swiper-animate-duration=".5s" swiper-animate-delay="1.5s" >
          <img src="img/104.jpg" alt="" class="ten1-tiv ani" swiper-animate-effect=" bounceInRight" swiper-animate-duration=".5s" swiper-animate-delay="2s" >
          <img src="img/105.jpg" alt="" class="ten1-six ani" swiper-animate-effect=" bounceInLeft" swiper-animate-duration=".5s" swiper-animate-delay="2.5s" >
          <img src="img/106.jpg" alt="" class="ten1-sev ani" swiper-animate-effect=" bounceInRight" swiper-animate-duration=".5s" swiper-animate-delay="3s" >
          <img src="img/107.jpg" alt="" class="ten1-eig ani" swiper-animate-effect=" bounceInLeft" swiper-animate-duration=".5s" swiper-animate-delay="3.5s" >
          <img src="img/108.jpg" alt="" class="ten1-nin ani" swiper-animate-effect=" bounceInRight" swiper-animate-duration=".5s" swiper-animate-delay="4s" >
          <div class="top_black"></div>    
      </div>

      <div class="swiper-slide">
          <img src="img/11_02.png" alt="" class="ten2-fir ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay=".2s">
          <img src="img/11_03.png" alt="" class="ten2-two ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay=".4s">
          <img src="img/11_04.png" alt="" class="ten2-thr ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay=".6s">
          <img src="img/11_05.png" alt="" class="ten2-for ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay=".8s">
          <img src="img/11_06.png" alt="" class="ten2-tiv ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay="1s">
          <img src="img/11_07.png" alt="" class="ten2-six ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay="1.2s">
          <img src="img/11_08.png" alt="" class="ten2-sev ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay="1.4s">
          <img src="img/11_09.png" alt="" class="ten2-eig ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay="1.6s">
          <img src="img/11_10.png" alt="" class="ten2-nin ani" swiper-animate-effect=" flipInX" swiper-animate-duration=".5s" swiper-animate-delay="1.8s">
          <div class="top_black"></div>    
      </div>

      <div class="swiper-slide">
        <img src="img/p12t.png" alt="" class="ten13-fir ani" swiper-animate-effect='lightSpeedIn' swiper-animate-duration=".5s" swiper-animate-delay="0.2s">
        <img src="img/p12s.png" alt="" class="xingkong">
        <img src="img/p12e.jpg" alt="" class="erweim ani" swiper-animate-effect="fadeInDown" swiper-animate-duration=".5s" swiper-animate-delay='1.7s'>
        <div class="tel ani" swiper-animate-effect="bounceInDown" swiper-animate-duration=".5s" swiper-animate-delay='.7s'>
            电话 : 4006-333-186 <br>  
            地址 : 北京石景山区总工会二层
        </div>
        <p class="chang ani" swiper-animate-effect="fadeInDown" swiper-animate-duration=".5s" swiper-animate-delay='1.2s'>长按二维码丶对话博看文思</p>
          <div class="top-slide"></div>
      </div>



    </div>
  </div>
 
</body>

  <!-- Swiper JS -->
  <script src="js/swiper.min.js"></script>
  <script src="js/swiper.animate1.0.3.min.js"></script>

  <!-- Initialize Swiper -->
  <script>
    (function (doc,win){
        resetPage = function () {
            var deviceWidth = doc.documentElement.clientWidth;
            var scale = deviceWidth / 640;
            if (deviceWidth >= 640) {
                doc.documentElement.style.fontSize = '100px';
            } else {
                doc.documentElement.style.fontSize = scale * 100 + 'px';
            }
        }
        if (!doc.addEventListener) {
            return;
        }
        doc.addEventListener('DOMContentLoaded', resetPage, false);
        win.addEventListener('resize', resetPage, false);
    })(document,window)


    var swiper = new Swiper('.swiper-container',{
      pagination: {
        el: '.swiper-pagination',
      },
      lazy: {
         loadPrevNext: true,
       },
      'direction':'vertical',
          on:{
          init: function(){
            swiperAnimateCache(this); //隐藏动画元素 
            swiperAnimate(this); //初始化完成开始动画
          }, 
          slideChangeTransitionEnd: function(){ 
            swiperAnimate(this); //每个slide切换结束时也运行当前slide动画
            //this.slides.eq(this.activeIndex).find('.ani').removeClass('ani'); 动画只展现一次，去除ani类名
          }
        }
   });

    document.addEventListener('DOMContentLoaded', function () {
        function audioAutoPlay() {
                mplay.play();
        }
        audioAutoPlay();
      });
  </script>
</html>
